import React, { useState, useEffect } from "react";
import "./index.scss";
import {
    PageHeader,
    Input,
    Divider,
    Button,
    Table,
    Pagination,
    Switch,
} from "antd";
import Assets from "../../../api/ykh/assets_ykh"

//Header表头
const routes = [
    {
        path: "first",
        breadcrumbName: "资产管理",
    },
];


//Content表格列数据
const columns = [
    {
        title: "时间",
        dataIndex: "assetsTime",

    },
    {
        title: "收支类型",
        dataIndex: "assetsType",
    },
    {
        title: "金额（元）",
        dataIndex: "assetsMoney",
    },
    {
        title: "账单类型",
        dataIndex: "accountType",
    },
    {
        title: "余额（元）",
        dataIndex: "balance",
    },
    {
        title: "账单摘要",
        dataIndex: "accountDetails",
    },
    {
        title: "订单号",
        dataIndex: "orderNumber",
    },
];



//表格页码
const onChange = (pageNumber) => {
    console.log("Page: ", pageNumber);
};


export default function ImgAbout() {
    const [selectedRowKeys, setSelectedRowKeys] = useState([]);

    const onSelectChange = (newSelectedRowKeys) => {
        console.log("selectedRowKeys changed: ", selectedRowKeys);
        setSelectedRowKeys(newSelectedRowKeys);
    };


    const rowSelection = {
        selectedRowKeys,
        onChange: onSelectChange,
    };
    //表格数据
    const [dataSource, setDataSource] = useState([])
    //获取数据
    const assets = () => {
        Assets.AssetsList().then((res) => {
            // console.log(res);

            setDataSource(res.data)
        })
    };
    const [money, setMoney] = useState(0)
    const moneyData = () => {
        Assets.AssetsBalance().then((res) => {
            // console.log(res.data);

            setMoney(res.data)
        })
    };
    //生命周期
    useEffect(() => {
        assets();
        moneyData();
    }, []);

    //页码
    const showTotal = (total) => `数量 ${total} 条`;
    return (
        <>
            <div className="Header">
                <PageHeader
                    className="site-page-header"
                    title="资产管理"
                    breadcrumb={{
                        routes,
                    }}
                />
                <Divider plain></Divider>
                <div className="flex1">
                    <div className="Header-left">
                        <span className="BannerName">账户余额</span>
                        <div className="Header-left">
                            <span className="BannerName sp1">{money}</span>
                        </div>
                    </div>

                </div>
            </div>
            <div className="Content ">
                <div className="flex2">
                    <div className="Content-left">
                        <h3 className="Advertising-Banner-List">操作记录</h3>
                    </div>
                    <div className="Content-right">

                        <Button className="batchBtn">导出</Button>
                    </div>
                </div>

                <Table
                    className={StyleSheet.rowStyle}
                    rowSelection={rowSelection}
                    columns={columns}
                    dataSource={dataSource}
                    pagination={{
                        total: dataSource.length,
                        showTotal: showTotal,
                        showSizeChanger: true,
                        showQuickJumper: true,
                    }}
                    rowKey={record => record.assetsId}
                />

            </div>
        </>
    );

}
